<!--
 * @Author: yinche 2814620694@qq.com
 * @Date: 2023-06-02 15:46:23
 * @LastEditors: yinche 2814620694@qq.com
 * @LastEditTime: 2023-06-17 23:21:20
 * @FilePath: \nodejsd:\新建 文件夹\qiemeng-app\src\views\Home.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
    <div class="home">
        <div class="header">
            <van-button disabled type="primary">欢迎使用且梦</van-button>
        </div>
        <div class="content">
            <div class="text">
                <p>欢迎访问我的项目库:</p>
                <span>更多内容还待拓展</span>
            </div>
            <div class="button">
                <div class="music">
                    <van-button type="primary" url="http://yinche.work:5173/">手机音乐播放器</van-button>
                    <van-button type="primary" url="http://yinche.work:7788/">PC音乐播放器</van-button>
                    <van-button type="primary" @click="$router.push('/bmp')">最后的棒棒</van-button>
                    <van-button type="primary" @click="$router.push('/cyn')">蜡笔小新剧场</van-button>
                    <van-button type="primary" @click="$router.push('/qiandao')">谦道</van-button>
                </div>
                <div class="row_two">
                    <van-button type="primary" @click="$router.push('/aub')">盗墓笔记</van-button>
                    <van-button type="primary" @click="notFound">待开发</van-button>
                    <van-button type="primary" @click="notFound">待开发</van-button>
                    <van-button type="primary" @click="notFound">待开发</van-button>
                    <van-button type="primary" @click="notFound">待开发</van-button>
                </div>
            </div>
        </div>
        <div class="footer">
            <div class="ba">
                <p style="text-align: center">
                    <a href="https://beian.miit.gov.cn/#/Integrated/index" target="_blank">鲁ICP备2023012453号</a>
                </p>
            </div>
        </div>
    </div>
</template>

<script setup>
const notFound = () => {
    alert('该功能待开发阶段,敬请期待~');
};
</script>

<style lang="less" scoped>
.home {
    .header {
        margin-top: 0.5rem;
        text-align: center;
    }
    .content {
        margin-top: 0.3rem;
        width: 100%;
        height: 8rem;
        opacity: 0.5;
        .button {
            padding: 6px;
            display: flex;
            flex-direction: column;
            .row_two {
                .van-button {
                    margin: 5px 5px;
                }
            }
            .music {
                align-items: center;
                justify-content: center;
                p {
                    // margin-top: 0.2rem;
                }
                margin-top: 0.2rem;
                .van-button {
                    margin: 5px 5px;
                }
            }
        }
        .text {
            background-color: #fff;
            text-align: center;
        }
    }
    .footer {
        width: 100%;
        height: 3rem;
    }
}
</style>
